<template>
  <view class="">
    <view class="page-userAuth" v-if="userInfo">
      <view class="userAuth-bg" v-if="userInfo.is_vip == 0"></view>
      <view class="userAuth-con" @click="navTo" v-if="userInfo.is_vip == 0">
        <view class="con-btn">
          我要开通VIP
        </view>
        <view class="con-text">
          只有会员才能看Ta的联系方式哦~
        </view>
      </view>
      <slot></slot>
    </view>
  </view>
</template>
<script setup lang="ts">
import {ref} from "vue";
import {getUserInfoApi} from "@/api/new";
import {onLoad} from "@dcloudio/uni-app";

const userInfo = ref() as any;

const getUserInfo = async () => {
  userInfo.value = await getUserInfoApi({})
}

getUserInfo()

const navTo = () => {
  uni.navigateTo({
    url: '/packages/pages/user/vip'
  })
}

</script>
<style scoped lang="scss">
.page-userAuth {
  position: relative;
  overflow: hidden;
  .userAuth-bg {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background-color: rgba(255,255,255,0.1);
    backdrop-filter:blur(10rpx);
  }
  .userAuth-con {
    width: 100%;
    position: absolute;
    padding: 30rpx;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    text-align: center;
    .con-btn {
      display: inline-block;
      padding: 10rpx 20rpx;
      font-size: 30rpx;
      color: var(--color-primary);
      border-radius: 40rpx;
      border: 2rpx solid var(--color-primary);
    }
    .con-text {
      font-size: 28rpx;
      margin-top: 20rpx;
      color: var(--color-primary);
    }
  }
}
</style>